<template>
	<div class="slicing-details-box">
		<router-link :to="{ name: 'ProductionOperation' }">
			<el-button type="primary" class="btn-bg-blue btn-box padding-lr-xl" @click="isShowReturn = false" v-if="isShowReturn">返回</el-button>
		</router-link>

		<!-- 喷号管理 -->
		<pol-title title="喷号管理"></pol-title>

		<div class="border-solid bg-tm radius-sm main-box-height el-input-num padding">
			<div class="flex-between spraying-t-box text-white">
				<div class="flex align-center">
					<img src="@/assets/images/icon/Frame.png" style="width: 122px; height: 122px;" />
					<div class="margin-left-xxl">
						<div>
							<span class="text-xl">设置打印炉号</span>
							<span class="text-green2 margin-left-lg">注：设置打印炉号将会把此炉号之前的所有铸坯状态变更为喷号完成！</span>
						</div>
						<div class="margin-top-xl">
							设置打印炉号可设置喷号内容，设置完成，新的一炉次生效
						</div>
					</div>
				</div>

				<div class="flex align-center margin-top-lg padding-lr">
					<div style="flex: 0 0 100px">当前打印炉号</div>
					<el-input v-model="values" placeholder="" size="large" class="margin-lr" style="width: 220px;" />
					<el-button icon="Edit" type="primary" class="btn-bg-blue" size="large">设置</el-button>
				</div>
			</div>

			<div class="flex bg-blue-furn text-white padding">
				<!-- 未打印 -->
				<div class="flex-sub">
					<div class="text-xl padding">未打印</div>

					<pol-table ref="polTableRef" v-bind="tableOpt" height="calc(100vh - 430px)">
						<template #gangbao="{row}">
							<span class="text-green2 cursor">修改</span>
						</template>
					</pol-table>
				</div>

				<!-- 已打印 -->
				<div class="flex-sub margin-left-xl">
					<div class="text-xl padding">已打印</div>
					
					<pol-table ref="polTableRef" v-bind="tableOpt" height="calc(100vh - 430px)">
						<template #gangbao="{row}">
							<span class="text-green2 cursor">修改</span>
						</template>
					</pol-table>
				</div>
			</div>
		</div>
	</div>
</template>

<script setup>
	import { ref } from 'vue';

	const isShowReturn = ref(false)
	setTimeout(() => {
		isShowReturn.value = true
	}, 600)

	const values = ref(24408912)

	//表格配置
	const columns = ref([
		{ label: '序号', key: 'ItemCode', align: 'center', width: '80' },
		{ label: '铸坯号', key: 'ItemName', align: 'center' },
		{ label: '流号', key: 'ItemValue', align: 'center' },
		{ label: '长度', key: 'IsDefault', align: 'center' },
		{ label: '切割时间', key: 'P_IsSys', align: 'center' },
		{ label: '打号状态', key: 'P_IsReadOnly', align: 'center' },
		{ label: '操作', key: 'gangbao', align: 'center', slot: true, width: '80' }
	]);

	//表格配置
	const tableOpt = ref({
		columns: columns.value,
		localData: [{
				ItemCode: '1',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '2',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '3',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '4',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '5',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '6',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '7',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '8',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '7',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '8',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '7',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
			{
				ItemCode: '8',
				ItemName: '244089775208',
				ItemValue: '2',
				IsDefault: '8.68',
				P_IsSys: '10:44:24',
				P_IsReadOnly: '未打号',
			},
		]
	});
</script>

<style lang="scss" scoped>
	.slicing-details-box {
		position: relative;

		.btn-box {
			position: fixed;
			top: 85px;
			right: 20px;
		}

		.spraying-t-box {
			padding: 20px 50px;
		}
	}
</style>